﻿<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no" />
    <title>选择人</title>
    <link href="../Frozenui1.3/css/frozen.css" rel="stylesheet" />
    <script src="../JS/zepto.min.js"></script>
    <script src="../Frozenui1.3/js/frozen.js"></script>
    <script src="../JS/MobileCom.js"></script>
    <script src="../JS/avalon.mobile.min.js"></script>
    <script >
        var model = avalon.define({
            $id: "wxuser",
            ctData: [],
            repshow: function () {
                if ($(this).parent().parent().hasClass("active")) {
                    $(this).parent().parent().removeClass("active");
                }
                else {
                    $(this).parent().parent().siblings().removeClass("active");
                    $(this).parent().parent().addClass("active");
                }
            },
            checkall: function (obj) {
                var chk = $(this).parent().parent().parent().parent();

                $.each(chk.find("input[type=checkbox]"), function () {
                    this.checked=obj.checked;
                })
            }

        })
        avalon.ready(function () {
            $.getJSON("/API/WXAPI.ashx?action=GETWXUSER", function (r) {
                model.ctData = r.Result;

            })
        })
        function goback() {
            parent.goback();
        }
        function goconfirm() {

             
            if ($("input.ui-user-chk:checked").length > 0) {
                var vuser = "";
                var vusername = "";
                $("input.ui-user-chk:checked").each(function (index, item) {
                    

                    var user=$(this).parent().parent().prev().find("h4").text();
                    if (user != null) {
                        if (vuser == "") {
                            vuser = user;
                        }
                        else {
                            vuser += "," + user;
                        }
                    }

                    var username=$(this).parent().parent().prev().find("span").text();
                    if (username != null) {
                        if (username == "") {
                            vusername = username;
                        }
                        else {
                            vusername += "," + username;
                        }
                    }

                })
                
                var js = '{"vuser":"' + vuser + '","vusername":"' + vusername + '"}';

                parent.goconfirm(JSON.parse(js));

            } else {
                parent.goconfirm(null);
            }
          
        }
    </script>

</head>
<body ms-controller="wxuser">
    <header class="ui-header ui-header-stable">
        <h1>选择人员</h1>
    </header>

    <div class="ui-footer ui-footer-stable ui-btn-group ui-border-t">
        <button class="ui-btn-lg" onclick="goback()">
            取消
        </button>
        <button class="ui-btn-lg ui-btn-primary" onclick="goconfirm()">
            确定
        </button>
    </div>

    <section class="ui-container">
        <div class="ui-selector">
            <div class="ui-selector-content">

                <ul>
                    <li ms-repeat-el="ctData" ms-class="ui-selector-item ">
                        <div class="ui-border-b" style="display: -webkit-box">
                            <h3 ms-click="repshow()"></h3>
                            <p style="line-height:44px" ms-click="repshow()">
                                {{el.DeptName}}
                                <span class="ui-txt-info" style="padding-right: 20px; float: right;">{{el.DeptUser.size()}}</span>
                            </p>
                            <div class="ui-form-item-checkbox " style="padding-right:10px">
                                <label class="ui-checkbox">
                                    <input type="checkbox" class="ui-user-chk" ms-click="checkall(this)">
                                </label>
                            </div>
                        </div>
                        <ul class="ui-list ui-border-b">
                            <li class="ui-border-b" ms-repeat-im="el.DeptUser">
                                <div class="ui-avatar-s">
                                    <span style="background-image:url(../img/ava1.png)"></span>
                                </div>
                                <div class="ui-list-info"><h4>{{im.UserRealName}}</h4><span style="display:none;">{{im.UserName}}</span></div>
                                <div class="ui-form-item-checkbox " style="padding-right:10px">
                                    <label class="ui-checkbox">
                                        <input type="checkbox" class="ui-user-chk">
                                    </label>
                                </div>
                            </li>
                        </ul>
                        <div style="padding-left:10px;" ms-include="'tmpl'" ms-visible="el.SubDept.length">

                        </div>


                    </li>


                </ul>
            </div>
        </div>
    </section>
    <script type="avalon" id="tmpl">
        <div class="ui-selector-content">
            <ul>
                <li ms-repeat-el="el.SubDept" ms-class="ui-selector-item">
                    <div class="ui-border-b" style="display: -webkit-box">
                        <h3 ms-click="repshow()"></h3>
                        <p style="line-height:44px" ms-click="repshow()">
                            {{el.DeptName}}
                            <span class="ui-txt-info" style="padding-right: 20px; float: right;">{{el.DeptUser.size()}}</span>
                        </p>
                        <div class="ui-form-item-checkbox " style="padding-right:10px">
                            <label class="ui-checkbox">
                                <input type="checkbox" class="ui-user-chk" ms-click="checkall(this)">
                            </label>
                        </div>
                    </div>
                    <ul class="ui-list ui-border-b">
                        <li class="ui-border-b" ms-repeat-im="el.DeptUser">
                            <div class="ui-avatar-s">
                                <span style="background-image:url(../img/ava1.png)"></span>
                            </div>
                            <div class="ui-list-info"><h4>{{im.UserRealName}}</h4><span style="display:none;">{{im.UserName}}</span></div>
                            <div class="ui-form-item-checkbox " style="padding-right:10px">
                                <label class="ui-checkbox">
                                    <input type="checkbox" class="ui-user-chk">
                                </label>
                            </div>
                        </li>
                    </ul>
                    <div style="padding-left:10px;" ms-include="'tmpl'" ms-visible="el.SubDept.length">

                    </div>
                </li>
            </ul>
            </div>
    </script>


</body>
</html>
